<template>
  <!--  custoNav customBackBtn-->
  <PublicPage pageName="可帮卖的" borderType class="ssp-can-help-sell">
    <!-- 自定义头部--tabs -->
    <!-- <view slot="headNav" class="ssp-header-nav">-->
    <!--   <u-tabs-->
    <!--       :list="tabList"-->
    <!--       :is-scroll="false"-->
    <!--       :current="tabsCur"-->
    <!--       :bold="false"-->
    <!--       :bar-style="{bottom: '-1px !important;'}"-->
    <!--       bar-height="4"-->
    <!--       active-color="#E44435"-->
    <!--       inactive-color="#969799"-->
    <!--       height="60"-->
    <!--       font-size="28"-->
    <!--       @change="_tabsChange"-->
    <!--   />-->
    <!-- </view>-->
    <view class="u-tabs_box">
      <u-tabs
          :list="tabList"
          :is-scroll="false"
          :current="tabsCur"
          :bold="false"
          bar-width="80"
          active-color="#E44435"
          inactive-color="#969799"
          font-size="32"
          height="92"
          @change="_tabsChange"
      />
    </view>
    <!-- 视频区域 -->
    <HelpVideo
        ref="helpVideoRef"
        :height="bodyHeight"
        :class="{displayNone:tabsCur===1}"
        @success="videoSuccess"
    />
    <!-- 商品区域 -->
    <HelpGoods
        ref="helpGoodsRef"
        :height="bodyHeight"
        :class="{displayNone:tabsCur===0}"
        @success="drawSuccess"
    />
    <!-- 邀请好友 -->
    <PublishPopup
        v-if="dlGroup"
        :sharePublishData="shareObject"
        @closeSharePublishFn="(flag)=>dlGroup=flag"
        @customInvite="_customInvite"
    />
    <!-- 点击立即邀请朋友参团之后弹框 -->
    <SharePopup
        v-if="dlShare"
        :shareObject="shareObject"
        @close="dlShare=false"
        @drawPoster="_drawPoster"
    />
    <!-- 保存相册海报分享 -->
    <SharePoster
        v-if="dlPoster"
        :shareVideoData="shareObject"
        @cancelSharePosterFn="dlPoster=false"
    />
    <!-- 已经帮卖弹窗 -->
    <SoldForHelpSell v-if="isSoldForHelpSellShow" @closeSoldForFn="closeSoldForFn" :soldForHelpSellId="soldForHelpSellId" />
  </PublicPage>
</template>

<script>
import PublicPage from '@/components/publicPage/index.vue'
import HelpVideo from './helpVideo.vue'
import HelpGoods from './helpGoods'
import PublishPopup from '@/components/publishPopup/index.vue'
import SharePopup from '@/pages/stream/components/sharePopup.vue'
import SharePoster from '@/components/shareModal/sharePoster.vue'
import mixin from '@/components/goodsWaterfall/methodMixin.js'
import { filterTabs } from './tabs'
import SoldForHelpSell from '@/components/soldForHelpSell/index.vue'
export default {
  name: 'canHelpSell',
  mixins: [mixin],
  components: {
    PublicPage,
    HelpVideo,
    HelpGoods,
    PublishPopup,
    SharePopup,
    SharePoster,
    SoldForHelpSell
  },
  data() {
    return {
      tabList: filterTabs, // tabs列表
      tabsCur: 0, // tabs当前激活标识
      bodyHeight: 0,
      isSoldForHelpSellShow: false, // 帮卖过了不可帮卖
      soldForHelpSellId: '', // 已经帮卖返回自己帮卖团的id
    }
  },
  watch:{
    publicUpdateData(nVal){
      if (nVal) {
        console.log(nVal)
        if (nVal.isSoldForHelpSellShow) {
          this.isSoldForHelpSellShow = nVal.isSoldForHelpSellShow
          this.soldForHelpSellId = nVal.soldForHelpSellId
        }
      }
    }
  },
  onShow() {
    if (this.isLogin) {
      this.getHelpVideo()
      this.getHelpGoods()
    }
  },
  async onReady() {
    const tabsDom = await this.getUNavbarHeight('.u-tabs_box')
    this.bodyHeight = `calc(100% - ${tabsDom.height||46}px)`
  },
  methods: {
    closeSoldForFn() {
      this.$store.commit('PUBLIC_UPDATE_DATA', null)
      this.isSoldForHelpSellShow = false
    },
    // tabs切换
    _tabsChange(index) {
      this.tabsCur = index
      if (this.isLogin) {
        this.getHelpVideo()
        this.getHelpGoods()
      }
    },
    // 视频
    getHelpVideo() {
      if (this.tabsCur === 0 && this.$refs.helpVideoRef) {
        this.$refs.helpVideoRef.getDynamics()
      }
    },
    // 商品
    getHelpGoods() {
      if (this.tabsCur === 1 && this.$refs.helpGoodsRef) {
        this.$refs.helpGoodsRef.getTabs()
        this.$refs.helpGoodsRef.getList()
      }
    },
    videoSuccess(res) {
      if (res.code === 4014) {
        this.soldForHelpSellId = res.soldForHelpSellId
        this.isSoldForHelpSellShow = true
      } else {
        this.shareObject = res
        this.dlGroup = true
      }
    },
  }
}
</script>

<style lang="scss" scoped>
.ssp-can-help-sell {
  .u-tabs_box {
    height: 92rpx;
    padding: 0 128rpx;
    background-color: #FFFFFF;
  }
  .displayNone{
    display: none !important;
  }
}
</style>
